<template>
  <div class="positionUser-page">
    <MainHead title="讲师活动查询" @change="getPageList()" />
    <el-card class="main-card" shadow="never" v-loading="$store.state.loading">
      <div class="search">
        <div></div>
        <div style="display: flex; align-items: center">
          <el-input
            style="width: 264px"
            placeholder="搜索活动名称"
            prefix-icon="el-icon-search"
            v-model="formData.positionActivityName"
          ></el-input>
          <el-button style="margin: 0 15px" @click="getPageList()"
            >搜索</el-button
          >
          <el-input
            style="width: 264px; margin-right: 15px"
            placeholder="搜索讲师姓名"
            prefix-icon="el-icon-search"
            v-model="formData.lecturerName"
          ></el-input>
          <el-button @click="getPageList()">搜索</el-button>
        </div>
      </div>
      <el-table
        :data="tableData"
        style="width: 100%"
        class="page-table"
        height="calc(100vh - 65px - 60px - 30px - 172px - 119px)"
      >
        <el-table-column prop="positionActivityName" label="活动名称">
        </el-table-column>
        <el-table-column prop="activityType" label="活动类型">
          <template slot-scope="{ row }">
            {{ row.activityType === 1 ? "展览类" : "会议类" }}
          </template>
        </el-table-column>
        <el-table-column prop="positionType" label="业务类型">
          <template slot-scope="{ row }">
            {{ row.positionType | positionType }}
          </template>
        </el-table-column>
        <el-table-column prop="topicTag" label="活动标签"> </el-table-column>
        <el-table-column prop="positionName" label="关联阵地">
        </el-table-column>
        <el-table-column prop="lecturerName" label="讲师名"> </el-table-column>
        <el-table-column prop="" label="联系方式"> </el-table-column>
        <el-table-column prop="establishmentUnit" label="建库单位">
        </el-table-column>
        <el-table-column prop="propagandaGroup" label="特色宣讲团">
        </el-table-column>
        <el-table-column prop="num" label="评价数"> </el-table-column>
        <el-table-column prop="developTime" label="开始时间"> </el-table-column>
      </el-table>
      <div class="footer-page">
        <Page v-model="pageInfo" @change="getPageList" />
      </div>
    </el-card>
  </div>
</template>
<script>
import Page from "@/components/Page";
export default {
  components: {
    Page,
  },
  data() {
    return {
      tableData: [],
      pageInfo: {
        pageNo: 1,
        pageSize: 10,
        total: 0,
      },
      formData: {},
    };
  },
  created() {
    this.getPageList();
  },
  methods: {
    getPageList() {
      const { pageNo, pageSize } = this.pageInfo;
      this.$Ajax(
        "/chuxin/admin/lecturer/activityQuery",
        "post",
        {
          page: pageNo,
          limit: pageSize,
          ...this.formData,
        },
        (res) => {
          this.tableData = res.data.list;
          this.pageInfo.total = res.data.totalCount;
        }
      );
    },
  },
};
</script>
<style lang="scss" scoped>
.positionUser-page {
  .title {
    display: flex;
    align-items: center;
    margin-top: 20px;
    h2 {
      font-size: 24px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #1c1d1d;
      margin: 0;
    }
  }

  .search {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 20px;
  }

  .footer-page {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 24px 0 0 0;
  }
}
</style>
